<template>
  <div>
    <my-table
      :tableData="tableData"
      :columnArr="columnArr"
      :search="false"
      :total="total"
      @add="add"
      @delete="remove"
      @update="update"
      @search="search"
      ></my-table>
  </div>
</template>
<script lang="ts">
import {defineComponent} from 'vue'
import {Request} from '@/utils/request'
import {ColumnType} from '@/components/table/index'
export default defineComponent({
  data(){
    return{
      tableData:[],
      columnArr:[
        {
          name:"部门名称",
          prop:"name",
          type:"text",
          lableWidth:100,
          search:true,
        },
        {
          name:"负责人",
          prop:"leader",
          type:"text",
          lableWidth:100
        },
        {
          name:"联系电话",
          prop:"tel",
          type:"text",
          lableWidth:100
        },
      ] as ColumnType,
      form:{
        page:1,
        size:10
      },
      total:0,
    }
  },
  mounted(){
    this.init()
  },
  methods:{
    init(){
      this.getList()
    },
    getList(){
      Request("/rest/department",'GET').then(res=>{
        const {list,total} = res.data
        if(res.data){
          this.tableData = list;
          this.total = total;
        };
      })
    },
    add(from:any,down:any){
      const {name,leader,tel} = from
      Request("/rest/department",'POST',{name,leader,tel}).then(res=>{
        down()
        this.getList()
      })
    },
    remove({_id}:any){
      Request(`/rest/department/${_id}`,'DELETE').then(res=>{
        this.getList()
      })
    },
    update({_id,name,leader,tel}:any,down:any){
      Request(`/rest/department/${_id}`,"PUT",{name,leader,tel}).then((res:any)=>{
        if(res.code == 200){
          down();
          this.getList()
        }
      })
    },
    search(){
      console.log(123);
    }
  }
})
</script>